import React from 'react';


import classnames from 'classnames';
//component
import ReAvatar from 'components/widgets/ReAvatar';
import ReIcon from 'components/widgets/ReIcon';


import './index.less';


export default class view extends React.Component {
    static propTypes = {
        //name: React.PropTypes.string,
    };

    static defaultProps = {
        //name: 'component name'
    };


    constructor(props, context) {

        super(props, context);
        // init state;
        this.state = {

        };
    }
    componentWillMount() {
        this._isMounted = true;

    }

    componentDidMount() {

    }

    componentWillUnmount() {
        this._isMounted = false;
    }

    render() {
        let {avatar,nickName,label,list} = this.props;
        return (
            <div className="phone-center-wrapper">
                <div className="avatar-wrapper">
                    <div className="avatar-wrap">
                        <ReAvatar src={avatar} size={100} className="avatar-image"/>
                        <div className="avatar-info">
                            <p className="name">{nickName}</p>
                            <p className="label">{label}</p>
                            <div className="btn-wrap">
                                <div className="more-info">
                                    <ReIcon icon="prompt_caveat" className="icon"/>
                                    <p className="text">更多信息</p>
                                </div>
                                <div className="edit">编辑资料</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="info-list">
                    {
                        list.map((item, index) => {
                            return(
                                <div className="list-item" key={index}>
                                    <p className="list-count">{item.count}</p>
                                    <p className="list-text">{item.text}</p>
                                </div>
                            )
                        })
                    }
                </div>
            </div>
        );
    }
}
